import React from 'react';
import ReactDOM from 'react-dom';

import {HashRouter as Router, Route, Redirect, Switch} from 'react-router-dom'
import {Provider} from 'mobx-react';
import {asyncComponent} from 'react-async-component';
import {Tools, Bubble} from 'weaver-mobile';

import './style'
import allStore from './stores';

const getLocaleLabel = Tools.getLocaleLabel.bind(this, 'common');
// const getLocaleLabel = Tools.getLocaleLabel('common',()=>{render(<Root/>,document.getElementById('root'))})
const getLabel = Tools.getLabel;
const coms = {
    Home: asyncComponent({
        resolve: () => import('./components/main')
    }),
    CollectionList: asyncComponent({
        resolve: () => import('./components/collectionList')
    }),
    Forward: asyncComponent({
        resolve: () => import('./components/detailPage/Forward')
    }),
    Test: asyncComponent({
        resolve: () => import('./components/collectionList/test')
    }),
    SC: asyncComponent({
        resolve: () => import('./components/SC')
    }),
    selectDir: asyncComponent({
        resolve: () => import('./components/selectDir')
    })
}

class Root extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            loadLang: false
        }
    }

    render() {
        return (
            <Provider {...allStore}>
                <Router>
                    <Route name="home" path="/" onEnter={getLocaleLabel} render={() => (
                        <coms.Home>
                            <Switch>
                                <Route name='test' path='/Test' component={coms.Test}/>
                                <Route name='collectionList' path='/favouriteList' component={coms.CollectionList}/>
                                <Route name='ss' path='/sss' component={coms.SC}/>
                                <Route name='forward' path='/forward' component={coms.Forward}/>
                                <Route name='selectDir' path='/selectDir' component={coms.selectDir}/>
                            </Switch>

                        </coms.Home>
                    )}/>


                </Router>
            </Provider>
        );
    }
}

Tools.getLocaleLabel("favourite", () => { // 多语言
    ReactDOM.render(<Root/>, document.getElementById('root'));
});